<template>
	<view :class="set.bgcolor ? set.bgcolor : 'bg-sun'" :style="'height:'+windowHeight+'px'" style="padding: 30px 20px 20px 20px;">
		<template v-if="!ismenu">
			<image src="../../static/images/menu.png" mode="widthFix" style="width: 100%;position: fixed;left: 0px;top: 0;z-index: 100;" :style="'height:'+windowHeight+'px'"></image>
			<button @click="isMenu" type="default" style="z-index: 101;position: fixed;bottom: 20px;width: 90%;">知道了</button>
		</template>
		
		
		<view :style="'line-height:' + set.l_hei + 'px;font-size:'+ set.f_size+'px;'">
			
			
			<swiper class="swiper" :style="{height:windowHeight-statusBarHeight-30 + 'px'}" duration="500" circular :current='pgindex' @change="gotopage" :vertical="vertical">
			<!-- <swiper class="swiper" :style="{height:windowHeight-statusBarHeight-30 + 'px'}" duration="500" circular :current='pgindex' @animationfinish="gotopage" :vertical="vertical"> -->
				
				
				<swiper-item v-for="(item,index) in nodes" :key="index" @click="gotopageclick">
						<text v-if="item" class="swiper-item uni-bg-red" decode="true" space="nbsp" >{{item}}</text>
						<view class="text-sm flex justify-between" style="position: fixed;bottom: 0px;width: 88%;line-height: 20px;">
							<view>{{ title }}</view>
							<view>
								<text>{{ index }}/{{ allpages }}</text>
							</view>
						</view>
				</swiper-item>
			</swiper>
			<view style="position: fixed;width: 100px;height: 200px;z-index: 99;" :style="{top:windowHeight/2-100+'px',left:windowWidth/2-50 + 'px'}" @click="showModal('bottomModal')"></view>
			

			<!-- <view v-for="(item,index) in nodes" :key="index" >
				<view v-if="pgindex == index"><text>{{item}}</text></view>
			</view> -->
			 <!-- 遮罩层 -->
			<!-- <view :style="'height:'+windowHeight+'px;'" class="zzc" >
				<view style="height:30%;width: 100%;" @click="gotopage('-1')"></view>
				<view class="flex" style="height: 40%;width: 100%;">
					<view style="width: 30%;" @click="gotopage('-1')"></view>
					<view style="width: 40%;" @click="showModal('bottomModal')"></view>
					<view style="width: 30%;" @click="gotopage('1')"></view>
				</view>
				<view style="height: 30%;width: 100%;" @click="gotopage('1')"></view>
			</view> -->

			<!-- <view class="text-sm flex justify-between" style="position: fixed;bottom: 0px;width: 88%;line-height: 20px;">
				<view>{{ title }}</view>
				<view>
					<text>{{ pgindex }}/{{ allpages }}</text>
				</view>
			</view> -->
		</view>
		
		
		<view class="cu-modal bottom-modal" :class="modalName == 'bottomModal' ? 'show' : ''" @click="hideModal">			
			<view class="cu-dialog" @click.stop>
				
				<!-- #ifdef APP-PLUS -->
				<view class="cu-bar cu-bar-mor padding-top-xl" style="height: 70px;"  @click="pageBack">
					<view class="action">
						<text class="cuIcon-back text-gray"></text>
					</view>
					<view class="content" style="font-size: 28upx;height: 70px;padding-top:30px ;">
						<text style="line-height: 40px;">{{title}}</text>
					</view>
				</view>
				<!-- #endif -->

				<!-- #ifdef H5 || MP-WEIXIN -->
				<view class="cu-bar cu-bar-mor"  @click="pageBack">
					<view class="action">
						<text class="cuIcon-back text-gray"></text>
					</view>
					<view class="content" style="font-size: 28upx;">
						{{title}}
					</view>
				</view>	
				<!-- #endif -->

				<view class="margin-lr-xl padding-tb-sm text-black">
					<view class="flex justify-between align-center text-sm margin-tb-sm " style="line-height: 48upx;">
						<view @click="ToRead(cid*1-1)">上一章</view>
						<view class="cu-progress round xs " style="width: 65%;"><view class="bg-red" :style="'width:'+jd+'%'"></view></view>
						<view  @click="ToRead(cid*1+1)">下一章</view>
					</view>
					<view class="padding-tb-sm flex justify-between text-center solid-top" style="font-size: 36upx;">
						<view @tap="showModalList" data-target="DrawerModalR">
							<image src="/static/images/dis.png" style="width: 48upx;height: 48upx;" mode="aspectFit"></image>
							<view class="text-sm">目录</view>
						</view>
						<view @click="DorN">
							<image :src="'/static/images/' + isday + '.png'" style="width: 48upx;height: 48upx;" mode="aspectFit"></image>
							<view class="text-sm">{{ isday == 'sun' ? '夜间' : '日间' }}</view>
						</view>
						<view @click="showModal('bgModal')">
							<image src="/static/images/shezi.png" style="width: 48upx;height: 48upx;" mode="aspectFit"></image>
							<view class="text-sm">设置</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<view class="cu-modal bottom-modal" :class="modalName == 'bgModal' ? 'show' : ''" @click="hideModal">
			<view class="cu-dialog" @click.stop>
				<view class="margin-lr-xl padding-tb-sm text-black">
					<view class="flex justify-around align-center" style="height: 80upx;">
						<view>字号大小</view>
						<view class="flex justify-between align-center" style="width: 60%;">
							<view class="round solid padding-lr-xl" style="font-size: 36upx;" @click="size('-1')">A-</view>
							<view>{{set.f_size }}</view>
							<view class="round solid padding-lr-xl" style="font-size: 36upx;" @click="size('1')">A+</view>
						</view>
					</view>
					
					<view class="flex justify-around align-center" style="height: 80upx;">
						<view>滑动方向</view>
						<view class="flex justify-between align-center" style="width: 60%;">
							<view class="round solid padding-lr-xl " :class="{'bg-brown':!set.vertical}" style="font-size: 36upx;" @click="verticalsize('heng')">横向</view>
							<view class="round solid padding-lr-xl" :class="{'bg-brown':set.vertical}" style="font-size: 36upx;" @click="verticalsize('shu')">竖向</view>
						</view>
					</view>

					<view class="flex justify-around align-center" style="height: 80upx;">
						<view>主题颜色</view>
						<view class="grid col-5 justify-around align-center" style="width: 60%;">
							<view class="padding-right-sm" @click="BgColor('bg-sun')">
								<view class="padding-tb-sm round solid bg-sun"></view>
							</view>
							
							<view class="padding-right-sm" @click="BgColor('bg-sky')">
								<view class="padding-sm round solid bg-sky"></view>
							</view>
							
							<view class="padding-right-sm" @click="BgColor('bg-violet')">
								<view class="padding-sm round solid bg-violet "></view>
							</view>
							
							<view class="padding-right-sm" @click="BgColor('bg-palm')">
								<view class="padding-sm round solid bg-palm"></view>
							</view>
							
							<view class="padding-right-sm" @click="BgColor('bg-wit')">
								<view class="padding-sm round solid bg-wit"></view>
							</view>

						</view>
					</view>

<!-- 					<view class="flex justify-around align-center" style="height: 80upx;">
						<view>翻页模式</view>
						<view class="flex justify-between align-center" style="width: 60%;">
							<view class="round solid text-xl align-center padding-lr-xl">
								<text class="text-xl">A</text>
								-
							</view>
							<view>18</view>
							<view class="round solid text-xl align-center padding-lr-xl">
								<text class="text-xl">A</text>
								+
							</view>
						</view>
					</view> -->
				</view>
			</view>
		</view>
		
		<view class="cu-modal drawer-modal justify-end" :class="modalName=='DrawerModalR'?'show':''" @tap="hideModal" >
			<view class="cu-dialog basis-lg bg-white" style="flex-basis:260px" @tap.stop="" >
				<scroll-view  scroll-y="true" style="height: 93%;" :scroll-top="top">
				<view class="cu-list menu text-left" >
					<view class="cu-item" v-for="(item,index) in chapters" :key="index" >
						<view class="content text-cut" style="font-size: 24upx;width: 230px;" @click="ToRead(index)">
							<text :class="cid == index ? 'text-bold text-blue' : ''">{{item.title}}</text>
						</view>
					</view>
				</view>
				</scroll-view>
				<view class="text-sm text-gray text-right padding-sm align-center flex justify-between" style="height: 5%;position: absolute;bottom: 0;width: 100%;" @tap="hideModal">
					<view class="text-cut">{{title}}</view>
					<view class="padding-left-sm solid-left cuIcon-order" @click.stop="" @click="order">倒序</view>
				</view>
			</view>
		</view>
		
		<view v-if="modalName == 'image'" class="cu-modal" :class="modalName == 'image'?'show':''" @click="toAdvert">
			<view class="cu-dialog">
				<image class="bg-img" :src="ggurl" mode="widthFix" style="width: 100%;"></image>
				
				<view class="cu-bar bg-white" >
					<view v-if="i>0" class="action margin-0 flex-sub  solid-left">{{i}}秒</view>
					<view v-else class="action margin-0 flex-sub  solid-left" @click.stop  @click="hideModal">关闭</view>
				</view>
			</view>
			<view style="position: fixed;bottom: 0; width: 100%;padding: 10px;height: 50px;line-height: 30px;" class="bg-white flex justify-between" @click="toAdvert">
				<view>{{ad_title}}</view>
				<view class="solid cu-btn bg-green round" style="height: 30px;" >点击查看</view>
			</view>
		</view>
		
		<!-- #ifdef H5 -->
		<view v-if="modalName == 'video'" style="position: fixed;top: 0px;left: 0;">
			<view v-if="platform == 'android'">
				<video :style="'height:'+windowHeight+'px;width:'+windowWidth+'px;'" :src="ggurl" autoplay="true" x5-video-player-type="h5">
					<cover-view v-if="i>0" class="bg-white round padding-xs text-center timelow" >
						{{i}}秒
					</cover-view>
					<cover-view v-else class="bg-white round padding-xs text-center timelow" @click="hideModal()">
						跳过
					</cover-view>
					<cover-view style="position: fixed;bottom: 0; width: 100%;padding: 10px;height: 30px;line-height: 30px;" class="bg-white flex justify-between" @click="toAdvert">
						<cover-view>{{ad_title}}</cover-view>
						<cover-view class="solid cu-btn bg-green round margin-right-xl" style="height: 30px;" >点击查看</cover-view>
					</cover-view>
				</video>
			</view>
			<view v-if="platform == 'ios'">
				<video :style="'height:'+windowHeight+'px;width:'+windowWidth+'px;'" :src="ggurl" autoplay="true">
					<cover-view v-if="i>0" class="bg-white round padding-xs text-center timelow" >
						{{i}}秒
					</cover-view>
					<cover-view v-else class="bg-white round padding-xs text-center timelow" @click="hideModal()">
						跳过
					</cover-view>
					<cover-view style="position: fixed;bottom: 0; width: 100%;padding: 10px;height: 30px;line-height: 30px;" class="bg-white flex justify-between" @click="toAdvert">
						<cover-view>{{ad_title}}</cover-view>
						<cover-view class="solid cu-btn bg-green round margin-right-xl" style="height: 30px;" >点击查看</cover-view>
					</cover-view>
				</video>
			</view>			
		</view>
		<!-- #endif -->
		
		
		
		<!-- #ifdef APP-PLUS -->
		<view v-if="modalName == 'video'" class="cu-modal" :class="modalName == 'video'?'show':''">
			<view v-if="i>0" class="bg-white round padding-xs text-center timelowapp" >{{i}}秒</view>
			<view v-else class="bg-white round padding-xs text-center timelowapp" @click="hideModal()">跳过</view>
			
			<video :src="ggurl" muted="true" autoplay="true" controls="false" style="width: 80%;position: fixed;bottom: 60px;left: 10%;" :style="{height: windowHeight*0.8+'px'}"></video>
			
			<view style="position: fixed;bottom: 0; width: 100%;padding: 10px;height: 50px;line-height: 30px;" class="bg-white flex justify-between" @click="toAdvert">
				<view style="z-index: 999;">{{ad_title}}</view>
				<view class="solid cu-btn bg-green round" style="height: 30px;" >点击查看</view>
			</view>
		</view>
		<!-- #endif -->		
	</view>
</template>

<script>
// var subNVue = uni.getSubNVueById('video');  
var that;
var getSystemInfo = uni.getSystemInfoSync();
var pageSet = {0:getSystemInfo.windowHeight , 1:getSystemInfo.windowWidth};
var obj = [];
var history;
var set = uni.getStorageSync('set') ? uni.getStorageSync('set') : {'l_hei': 40,'f_size': 20 , 'vertical' : false , 'bgcolor': 'bg-sun'};
var taBack = uni.getStorageSync('taBack');
var isShelf = uni.getStorageSync('shelf');
var arr = [];
var text;
var id;
var nid;
var nextcid;
var prevcid;
var lastcid;
var cid;
var setting;
var sjs;
var pgindex = 1;
var chapters;
export default {
	data() {
		return {
			ismenu: uni.getStorageSync('ismenu'),
			vertical:set.vertical ? set.vertical : false,
			data: null,
			cid : 0,
			top : 0,
			jd : null,
			type : null,
			i : null,
			ggurl : '',
			ad_title : '',
			gid : null,
			platform : null,
			
			modalName: null,
			loading: false,
			isday: 'sun',
			oldbg: 'bg-sun',
			chapters : [],
			
			windowHeight:getSystemInfo.windowHeight,
			windowWidth:getSystemInfo.windowWidth,
			statusBarHeight:this.system.statusBarHeight,
			set: uni.getStorageSync('set') ? uni.getStorageSync('set') : {'l_hei': 40,'f_size': 20 , 'bgcolor': 'bg-sun'},
			
			arr: [],
			nodes: [],
			title: null,
			pgindex: 1,
			allpages: 0,
		};
	},
	
	async onLoad(option) {
		that = this;
		// // #ifdef APP-PLUS
		// uni.getSubNVueById('video').hide()  
		// // #endif
		id = option.id
		nid = option.nid
		cid = option.cid
		uni.showLoading({
				title : '少侠请稍候...',
		});
		that.cid = option.cid
		lastcid = option.lastcid
		that.jd = (option.cid/option.lastcid)*100
		sjs = that.randomNum(2,10)
		chapters = uni.getStorageSync('chapters')
		var nextbody = uni.getStorageSync('nextbody');
		var oldid = uni.getStorageSync('nowbook');
		if(chapters.length > 0 && oldid.id == id){
			var read = {'prevcid' : option.cid*1 - 1,'nextcid':option.cid*1+1,'title':chapters[option.cid].title,'link':chapters[option.cid].link}
		}else{
			chapters = await that.util.get('VueBook',{op : 'chapters' , nid : nid,id:id})
			uni.setStorage({
				key: 'chapters',
				data: chapters
			});
			var read = {'prevcid' : option.cid*1 - 1,'nextcid':option.cid*1+1,'title':chapters[option.cid].title,'link':chapters[option.cid].link}
		}
		var newlink = chapters[(option.cid*1)+1].link
		console.log(newlink);
		if (nextbody && nextbody.id == id && cid == nextbody.nextbody.cid) {
			var body = nextbody.nextbody.nextbody
		}else{
			var body = await that.util.get('VueRead',{'nid' :option.nid , 'cid':option.cid , id:id,'link': read.link});
		}
		// #ifdef H5
		document.title = chapters[option.cid].title;
		// #endif
		// that.data = body.book
		prevcid = read.prevcid
		nextcid = read.nextcid
		that.title = read.title
		var str = body.chapter.body
		if (!str) {
			uni.showToast({
				title: '江湖略卡，少侠请重试',
				duration: 2000,
				icon:'none',
			});
			
			setTimeout(function () {
				that.pageBack()
			}, 2000);
			return false
		}
		arr = str.split("\n");
		var e = {
			'wenzi' : arr,
			'pageSet' : pageSet,
			'fontSet' : that.set,
		}
		var data = that.pageSet(e)
		text = data.cpContent
		that.nodes = data.cpContent;
		that.allpages = data.cot
		that.bgcolor = taBack.bgcolor;
		if (taBack.isday && taBack.isday != 'undefined') {
			that.isday = taBack.isday
		}
		uni.setStorage({
			key: 'nowbook',
			data: {'id' : id}
		});
		uni.hideLoading();
		that.util.get('VueRead',{'nid' :option.nid , 'cid':option.cid*1+1 , id:id , 'link': newlink})
		.then(res=>{
			uni.setStorage({
				key: 'nextbody',
				data: {
					id : id,
					nextbody : {'nextbody':res,'cid':cid*1+1}
				}
			});
		})
		
	},
	
	async onShow() {
		setting = await that.util.get('VueGetSetting',{'cid' : cid});
		that.ad_title = setting.title
		that.gid = setting.id
		that.platform = getSystemInfo.platform
		history = uni.getStorageSync(id);
		if (history.pgindex > 0 && history.cid == that.cid) {
			var pgin = history.pgindex
		}else{
			var pgin = 1
			uni.setStorage({
				key: id,
				data: {'pgindex' : pgin , 'cid' : that.cid , 'nid' : nid , 'id' : id}
			});
		}
		that.pgindex = pgin
		pgindex = pgin
	},
	async onReady() {
		var setting = await that.util.setting()
		// #ifdef H5
		if (that.isWeiXin) {
			var wx = await that.util.jssdk() 
			wx.ready(function () {	
				var sharedata = {
					title: that.data.title,
					desc: that.data.longIntro,
					imgUrl: that.data.cover,
					success: function(){
						
					},
					cancel: function(){							
					}
				};
				wx.onMenuShareAppMessage(sharedata);
				wx.onMenuShareTimeline(sharedata);						
			});
		}		
		// #endif
	},
	methods: {
		ToRead(e){
			that = this
			that.modalName = null
			if(e >= 0 ){
				uni.reLaunch({
					url: '/pages/read/read?nid='+nid+'&cid='+e+'&id='+id+'&lastcid='+lastcid
				});
			}
			if (e== -1 && nextcid == -1) {
				uni.showToast({
					title: '没有下一章了',
					icon : 'none',
					duration: 1000,
				});
				setTimeout(function () {
					that.pageBack()
				}, 1000);
			}else if(e== -1 && prevcid == -1) {
				uni.showToast({
					title: '没有上一章了',
					icon : 'none',
					duration: 1000,
				});
			}
		},
		
		toAdvert(){
			this.modalName = null;
			uni.navigateTo({
				url: '/pages/read/advert?id='+setting.id
			});
		},
		
		order(){
			that.chapters = that.chapters.reverse()
		},

		BgColor(e){
			that.bgcolor = e
			that.set = {
				f_size: that.set.f_size,
				l_hei: that.set.l_hei,
				bgcolor : e
			};
			uni.setStorage({
				key: 'set',
				data: that.set
			});
		},
		
		pageSet(e){
			var pageHeight = parseInt((e.pageSet[0] - this.system.statusBarHeight - 50) / e.fontSet.l_hei) * e.fontSet.l_hei
			var fontCont = parseInt((e.pageSet[1] - 40)/(e.fontSet.f_size))
			var lingCont = parseInt(pageHeight/e.fontSet.l_hei)
			var reg = new RegExp(".{" + fontCont + "}","g")
			var res = []
			for ( var i = 0; i < e.wenzi.length; i++){
				e.wenzi[i] = e.wenzi[i].replace("\n","");
				e.wenzi[i] = e.wenzi[i].replace("　　","");
				e.wenzi[i] = "　　"+e.wenzi[i]
				var l = e.wenzi[i].length;
				if (l > fontCont) {
					var s = e.wenzi[i]
					var rs = s.match(reg);
					rs.push(s.substring(rs.join('').length)); 
					for ( var k = 0; k <rs.length; k++){
						if (rs[k] != '') {res.push(rs[k]+'\n');} 
					}
				}else{
					if (e.wenzi[i] != '') {res.push(e.wenzi[i]+'\n');}
				}
			}
			var cot = 0
			var textArr = []
			var cpContent = []
			for ( var n = 0; n <res.length; n++){
				if ( n == cot*lingCont) {
					cot++
				}
				if (cpContent[cot] == undefined) {
					cpContent[cot] = res[n]
				} else{
					cpContent[cot] += res[n]
				}
			}
			cpContent.push('');
			var nodes = {
				cpContent : cpContent,
				cot : cot
			}
			return nodes;
		},
		
		gotopageclick(e) {
			var pgi = pgindex+1
			if ( pgi > that.allpages) {
				that.ToRead(nextcid)
			} else if(pgi <= 0){
				that.ToRead(prevcid)
			}else{
				pgindex = pgi
				that.pgindex = pgi
			}

		},
		
		gotopage(value) {
			var pgi = value.detail.current
			if ( pgi > that.allpages) {
				that.ToRead(nextcid)
			} else if(pgi <= 0){
				that.ToRead(prevcid)
			}

			uni.setStorage({
				key: id,
				data: {'pgindex' : pgi , 'cid' : that.cid , 'nid' : nid , 'id' : id}
			});
			if (setting && pgi == sjs) {
				if (setting.type == 1) {
					that.modalName = 'image'
					that.ggurl = setting.thumb
				} else{
					that.modalName = 'video'
					that.ggurl = setting.mp4
				}
				// // #ifdef APP-PLUS
				// uni.getSubNVueById('video').show('zoom-out', 300, function(){  
				// 	uni.getSubNVueById('video').postMessage({  
				// 		ggurl : that.ggurl,
				// 		height : that.windowHeight/that.windowWidth
				// 	});
				// });
				// // #endif
				
				
				var i = setting.seconds-1
				that.i = setting.seconds
				var time = setInterval(function () {
					that.i = i--
					if (that.i < 1 ) {
						clearInterval(time)
					}
				}, 1000);
			}
			pgindex = pgi
		},
		
		pageBack() {
			uni.redirectTo({
				url: '/pages/book/book?id='+id
			});
		},
		
		DorN() {
			that = this;
			if (that.isday == 'sun') {
				that.isday = 'night';
				that.oldbg = that.set.bgcolor;
				that.set.bgcolor = 'bg-night';
				var frontColor = '#ffffff'
				var backgroundColor = '#333333'
			} else {
				that.isday = 'sun';
				that.set.bgcolor = that.oldbg;
				var frontColor = '#000000'
				var backgroundColor = '#f1f1f1'
			}
			uni.setStorage({
				key: 'taBack',
				data: {'frontColor' : frontColor , 'backgroundColor' : backgroundColor , 'bgcolor' : that.bgcolor , 'isday' : that.isday}
			});
			uni.setStorage({
				key: 'set',
				data: that.set
			});
		},
		verticalsize(e){
			var size = that.set.f_size;
			var height = that.set.l_hei;
			if (e == 'heng') {
				that.set = {
					f_size: size,
					l_hei: height,
					bgcolor : set.bgcolor,
					vertical : false
				};
				that.vertical = false
			} else {
				that.set = {
					f_size: size,
					l_hei: height,
					bgcolor : set.bgcolor,
					vertical : true
				};
				that.vertical = true
			}
			uni.setStorage({
				key: 'set',
				data: that.set
			});
		},
		size(e) {
			that = this;		
			var size = that.set.f_size;
			var height = that.set.l_hei;
			if (e == '1') {
				size++;
				height = size * 2;
			} else {
				size--;
				height = size * 2;
				// that.gotopage('-1')
			}
			
			that.set = {
				f_size: size,
				l_hei: height,
				bgcolor : that.set.bgcolor,
				vertical : that.vertical
			};
			// arr = str.split("\n");
			
			var e = {
				'wenzi' : arr,
				'pageSet' : pageSet,
				'fontSet' : that.set,
			}
			var data = that.pageSet(e)
			history = uni.getStorageSync(id);
			if (history.pgindex > 0) {
				var pgin = history.pgindex
			}else{
				var pgin = 1
			}
			text = data.cpContent
			that.nodes = data.cpContent;
			that.pgindex = pgin
			that.allpages = data.cot
			uni.setStorage({
				key: 'set',
				data: that.set
			});
		},		
		randomNum(minNum,maxNum){ 
				switch(arguments.length){ 
						case 1: 
								return parseInt(Math.random()*minNum+1,10); 
						break; 
						case 2: 
								return parseInt(Math.random()*(maxNum-minNum+1)+minNum,10); 
						break; 
								default: 
										return 0; 
								break; 
				} 
		},		
		showModalList(e) {
			var modaln = e.currentTarget.dataset.target
			that.modalName = null
			if (modaln = 'DrawerModalR') {
				uni.showLoading({
						title : '少侠请稍候...',
						success:function(){
							
						}
				});
				that.util.request({
					'url' : 'VueBook',
					'data' : {
						op : 'chapters',
						nid : nid,
						id:id
					},
					showLoading : false,
					success:function(res){
						that.chapters = res.data.data
						that.modalName = modaln
						// that.top = that.cid*50
						that.$nextTick(function() {
                that.top = (that.cid-1)*50
            });
						
					}
				})
			}
			
			
		},
		isMenu(){
			that.ismenu = true
			uni.setStorage({
				key: 'ismenu',
				data: true
			});
		},
		showModal(e) {
			this.modalName = null;
			this.modalName = e;
		},

		hideModal(e) {
			// // #ifdef APP-PLUS
			// if (this.modalName == 'video') {
			// 	uni.getSubNVueById('video').postMessage({  
			// 		ggurl : that.ggurl,
			// 		height : that.windowHeight/that.windowWidth
			// 	});
			// 	uni.getSubNVueById('video').hide()
			// }
			// // #endif
			if (this.ggurl) {
				this.ggurl = null
			}
			this.type = null
			this.modalName = null;
			
		}
	}
};
</script>

<style>
	page{background-color:#333333;}
	.model-top {
		position: fixed;top: 0px;background-color: #f1f1f1;width: 100%;
	}
	
	.cu-bar-mor {
		position: fixed;top:0;width: 100%;background-color: #f1f1f1;
	}
	
.zzc {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 999;
	width: 100%;
}

.bg-sun {
	background-color: #def7d9;
	color: #333333;
}

.bg-night {
	background-color: #333333;
	color: #AAAAAA;
}

.bg-palm {
	background-color: #dccaa3;
	color: #333333;
}

.bg-violet {
	background-color: #f1ebfb;
	color: #333333;
}

.bg-sky {
	background-color: #d0e7f5;
	color: #333333;
}

.bg-wit {
	background-color: #ffffff;
	color: #333333;
}

.video {
	height: 30px;line-height: 30px;background: #FFFFFF;position: fixed;top: 15px;right: 20px;
}

.timelow{
	position: fixed;top:50px;right: 20px;width: 50px;
}
.timelowapp{
	position: fixed;top:30px;right: 20px;width: 50px;
}
</style>
